<template>
  <div class="main-container">
    <!-- 头部 -->
    <Header></Header>

    <div class="main-box">
      <Nav></Nav>

      <div class="main-body">
        <router-view></router-view>
      </div>
    </div>
  </div>
</template>
<script>
import Header from '@/components/subComponents/Header.vue'
import Nav from '@/components/subComponents/Nav.vue'

export default {
  components: {
    Header,
    Nav
  }
}
</script>
<style lang="less" scoped>
.main-container {
  height: 100%;
  display: flex;
  flex-direction: column;

  .main-box {
    height: 100%;
    display: flex;

    .main-body {
      padding: 15px;
      flex: 1;
    }
  }
}
</style>
